<template>
	<view class="goods-base-info">
		<view>
			<u-image class="u-skeleton-fillet" :width="imgWidth" :height="imgHeight" :src="goods.cover_url"></u-image>
			<view class="title u-line-1 u-p-t-20 u-p-l-20 u-skeleton-fillet">{{goods.title ? goods.title : "&nbsp;&nbsp;&nbsp;&nbsp;"}}</view>
			<view class="u-flex u-row-between u-p-20">
				<view class="price u-skeleton-fillet">￥:{{goods.price}}</view>
				<view class="sales u-skeleton-fillet">销量: {{goods.sales}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"goods-base-info",
		props:{
			goods: {
				type: Object,
				default(){
					return {}
				}
			},
			imgWidth: {
				type: String,
				default(){
					return '100%'
				}
			},
			imgHeight: {
				type: String,
				default(){
					return '300rpx'
				}
			}
		},
		data() {
			return {
				
			};
		}
		
	}
</script>

<style lang="scss" scoped>
.goods-base-info{
	margin: 0 0 40rpx 0;
	box-shadow: 0 10rpx 20rpx 0 rgba(0, 0, 0, 0.1);
	.title {
		font-weight: 500;
		font-size: 32rpx;
		min-width: 100rpx;
	}
	.price {
		font-size: 32rpx;
		color: #f23c25;
		min-width: 100rpx;
	}
	.sales {
		min-width: 100rpx;
		color: grey;
	}
}
</style>